<template>
  <div class="agreement-container">
    <div class="agreement-header">
      <button @click="goBack" class="back-button">← 返回</button>
      <h1>用户协议</h1>
    </div>
    
    <div class="agreement-content">
      <section class="agreement-section">
        <h2>1. 协议概述</h2>
        <p>欢迎您使用绿碳圈（以下简称"本平台"）提供的服务。本协议是您与绿碳圈之间关于使用本平台服务的权利义务规范。请您仔细阅读本协议的全部条款，特别是免除或限制责任的条款，以及开通或使用某项服务的单独协议。</p>
      </section>
      <section class="agreement-section">
        <h2>2. 服务内容</h2>
        <p>2.1 绿碳圈是一个专注于碳足迹记录、环保挑战、社区互动和碳积分兑换的综合性环保平台。</p>
        <p>2.2 本平台提供的主要服务包括但不限于：</p>
        <ul>
          <li>碳足迹记录与分析；</li>
          <li>环保挑战参与与完成；</li>
          <li>环保知识学习与分享；</li>
          <li>社区互动（发布内容、评论、点赞等）；</li>
          <li>碳积分获取与兑换；</li>
          <li>虚拟植树与环保成就系统。</li>
        </ul>
        <p>2.3 本平台有权根据用户需求、市场变化及法律法规要求，随时调整、升级或变更服务内容，无需另行通知用户。</p>
      </section>
      <section class="agreement-section">
        <h2>3. 用户注册与账号管理</h2>
        <p>3.1 用户在使用本平台服务前，必须注册一个账号。注册时，用户应提供真实、准确、完整的个人资料。</p>
        <p>3.2 用户应妥善保管账号和密码，对使用该账号进行的所有活动和操作承担全部责任。</p>
        <p>3.3 如发现账号被他人非法使用，用户应立即通知本平台，并配合本平台采取措施。</p>
        <p>3.4 用户可随时修改账号信息，但应保证信息的真实性、准确性和完整性。</p>
        <p>3.5 用户达到法定年龄且具有完全民事行为能力。若用户不具备完全民事行为能力，应在法定监护人的指导下使用本平台服务。</p>
      </section>
      <section class="agreement-section">
        <h2>4. 用户行为规范</h2>
        <p>4.1 用户在使用本平台服务时，应遵守法律法规和社会公德，不得从事以下行为：</p>
        <ul>
          <li>违反宪法确定的基本原则；</li>
          <li>危害国家统一、主权和领土完整；</li>
          <li>泄露国家秘密、危害国家安全或损害国家荣誉和利益；</li>
          <li>煽动民族仇恨、民族歧视，破坏民族团结；</li>
          <li>破坏国家宗教政策，宣扬邪教和封建迷信；</li>
          <li>散布谣言，扰乱社会秩序，破坏社会稳定；</li>
          <li>散布淫秽、色情、赌博、暴力、凶杀、恐怖或教唆犯罪的信息；</li>
          <li>侮辱或诽谤他人，侵害他人合法权益；</li>
          <li>违反法律法规的强制性规定；</li>
          <li>其他违反法律法规或公序良俗的行为。</li>
        </ul>
        <p>4.2 用户不得利用本平台从事任何非法活动，不得干扰本平台的正常运行，不得侵害其他用户或第三方的合法权益。</p>
        <p>4.3 用户应尊重本平台的知识产权，不得未经授权复制、修改、传播或利用本平台的任何内容。</p>
      </section>
      <section class="agreement-section">
        <h2>5. 碳足迹记录与数据管理</h2>
        <p>5.1 用户可以通过本平台记录和管理自己的碳足迹数据，包括但不限于出行、饮食、购物等方面的碳排放。</p>
        <p>5.2 用户应保证所记录的碳足迹数据真实、准确。本平台不对用户提供的数据的真实性、准确性承担责任。</p>
        <p>5.3 本平台有权对用户记录的碳足迹数据进行分析和统计，用于提供个性化服务和改进产品功能。</p>
        <p>5.4 用户可以查看、修改或删除自己的碳足迹记录，但删除操作一旦完成，数据将无法恢复。</p>
      </section>
      <section class="agreement-section">
        <h2>6. 环保挑战与碳积分规则</h2>
        <p>6.1 用户可以参与本平台发布的各类环保挑战活动。参与挑战即表示用户同意遵守挑战规则。</p>
        <p>6.2 用户完成挑战后，可以获得相应的碳积分奖励。碳积分的具体获取规则由本平台根据挑战难度、时长等因素制定。</p>
        <p>6.3 碳积分仅用于在本平台兑换虚拟或实物奖励，不得转让、出售或用于其他用途。</p>
        <p>6.4 本平台有权根据运营需要调整碳积分规则，包括但不限于积分获取方式、积分价值、兑换比例等。</p>
        <p>6.5 用户不得以任何作弊或欺诈手段获取碳积分。如发现此类行为，本平台有权取消用户的积分，并追究相应责任。</p>
      </section>
      <section class="agreement-section">
        <h2>7. 社区互动规范</h2>
        <p>7.1 用户可以在社区中发布环保相关内容、参与讨论、分享经验等。</p>
        <p>7.2 社区内容应符合法律法规和本平台规则，不得包含违法、违规或不良信息。</p>
        <p>7.3 用户应尊重其他社区成员，不得进行人身攻击、侮辱或歧视。</p>
        <p>7.4 本平台有权对社区内容进行审核和管理，对于违反规则的内容，有权采取删除、屏蔽等措施。</p>
        <p>7.5 用户在社区发布的原创内容，用户保留著作权，但授予本平台免费、非独家、可转让的使用权，用于平台展示、推广等用途。</p>
      </section>
      <section class="agreement-section">
        <h2>8. 隐私保护</h2>
        <p>8.1 本平台重视用户隐私保护，严格遵守相关法律法规和隐私政策的规定。</p>
        <p>8.2 本平台收集、使用、存储和保护用户个人信息的具体做法，详见《隐私政策》。</p>
        <p>8.3 用户同意本平台按照隐私政策的规定处理其个人信息。</p>
      </section>
      <section class="agreement-section">
        <h2>9. 知识产权</h2>
        <p>9.1 本平台的所有内容，包括但不限于文字、图片、音频、视频、软件、程序、数据等，均受著作权、商标权、专利权等知识产权法律法规的保护。</p>
        <p>9.2 未经本平台明确书面授权，用户不得复制、修改、传播、出售、租赁或利用本平台的任何内容。</p>
        <p>9.3 用户在本平台发布的内容，其知识产权归用户所有，但用户授予本平台免费、非独家、可转让的使用权。</p>
      </section>
      <section class="agreement-section">
        <h2>10. 免责声明</h2>
        <p>10.1 本平台仅提供信息存储空间和技术支持，不对用户发布的内容承担责任。</p>
        <p>10.2 由于不可抗力、第三方原因或技术故障等原因导致本平台服务中断或数据丢失的，本平台不承担责任。</p>
        <p>10.3 用户因使用本平台服务而产生的任何损失，本平台不承担赔偿责任，除非该损失是由于本平台的故意或重大过失造成的。</p>
        <p>10.4 本平台不对任何通过本平台服务获得的信息或建议的准确性、可靠性、适用性等作出保证。</p>
      </section>
      <section class="agreement-section">
        <h2>11. 协议修改与终止</h2>
        <p>11.1 本平台有权随时修改本协议的内容，并在平台上公布修改后的协议。修改自公布之日起生效。</p>
        <p>11.2 如用户不同意修改后的协议，可以停止使用本平台服务；如继续使用，则视为接受修改后的协议。</p>
        <p>11.3 用户可以随时终止使用本平台服务。</p>
        <p>11.4 用户违反本协议的规定，本平台有权采取警告、限制功能、暂停账号、注销账号等措施。</p>
        <p>11.5 协议终止后，本平台将停止提供服务，但不影响已有的权利义务关系。</p>
      </section>
      <section class="agreement-section">
        <h2>12. 法律适用与争议解决</h2>
        <p>12.1 本协议的订立、执行、解释及争议的解决均适用中华人民共和国法律。</p>
        <p>12.2 如双方发生争议，应首先通过友好协商解决；协商不成的，任何一方均有权向有管辖权的人民法院提起诉讼。</p>
      </section>
      <section class="agreement-section">
        <h2>13. 其他条款</h2>
        <p>13.1 本协议自用户注册或使用本平台服务之日起生效。</p>
        <p>13.2 本协议的各项条款具有独立性，如某条款被认定为无效或不可执行，不影响其他条款的效力。</p>
        <p>13.3 本平台在法律允许的范围内对本协议拥有最终解释权。</p>
      </section>
      <section class="agreement-section">
        <h2>14. 联系我们</h2>
        <p>如您对本协议有任何疑问、意见或建议，请通过以下方式与我们联系：</p>
        <p>电子邮件：support@lvtanquan.com</p>
      </section>
      <section class="agreement-section">
        <h2>15. 生效日期</h2>
        <p>本用户协议自2024年1月1日起生效。</p>
      </section>
    </div>
  </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'

const router = useRouter()

const goBack = () => {
  router.back()
}
</script>

<style scoped>
.agreement-container {
  min-height: 100vh;
  background-color: #f5f7fa;
  padding: 20px;
}

.agreement-header {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  gap: 20px;
}

.back-button {
  background-color: #4CAF50;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 5px;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.3s;
}

.back-button:hover {
  background-color: #45a049;
}

.agreement-header h1 {
  margin: 0;
  color: #333;
  font-size: 24px;
}

.agreement-content {
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  max-width: 800px;
  margin: 0 auto;
}

.agreement-section {
  margin-bottom: 30px;
}

.agreement-section h2 {
  color: #4CAF50;
  font-size: 20px;
  margin-bottom: 15px;
  border-left: 4px solid #4CAF50;
  padding-left: 10px;
}

.agreement-section p {
  color: #666;
  line-height: 1.8;
  margin-bottom: 10px;
  text-align: justify;
}

.agreement-section ul {
  color: #666;
  line-height: 1.8;
  margin-bottom: 15px;
  padding-left: 20px;
}

.agreement-section li {
  margin-bottom: 8px;
}

@media (max-width: 768px) {
  .agreement-container {
    padding: 10px;
  }
  
  .agreement-content {
    padding: 20px;
  }
  
  .agreement-header h1 {
    font-size: 20px;
  }
  
  .agreement-section h2 {
    font-size: 18px;
  }
}
</style>